// 初始化成绩分布图表
const chartDom = document.getElementById('scoreChart');
const myChart = echarts.init(chartDom);

const option = {
	tooltip: {
		trigger: 'axis',
		axisPointer: {
			type: 'shadow'
		}
	},
	grid: {
		left: '3%',
		right: '4%',
		bottom: '3%',
		containLabel: true
	},
	xAxis: {
		type: 'category',
		data: ['0-59', '60-69', '70-79', '80-89', '90-100'],
		axisTick: {
			alignWithLabel: true
		}
	},
	yAxis: {
		type: 'value',
		name: '人数',
		minInterval: 1
	},
	series: [{
		name: '学生人数',
		type: 'bar',
		barWidth: '60%',
		data: [5, 15, 25, 35, 15],
		itemStyle: {
			color: '#24344d'
		}
	}]
};

myChart.setOption(option);

// 窗口大小改变时重绘图表
window.addEventListener('resize', () => {
	myChart.resize();
});

// 搜索功能
document.querySelector('.search-btn').addEventListener('click', function() {
	const className = document.querySelector('.search-select').value;
	const searchText = document.querySelector('.search-input').value.toLowerCase();

	const rows = document.querySelectorAll('.results-table tbody tr');
	rows.forEach(row => {
		const name = row.children[1].textContent.toLowerCase();
		const id = row.children[2].textContent.toLowerCase();

		if (searchText && !name.includes(searchText) && !id.includes(searchText)) {
			row.style.display = 'none';
		} else {
			row.style.display = '';
		}
	});
});